{%extends file='layout/layout.html' %}
{%block name="content"%}
<div class="forms">
    <ul>
        <li>
            <label class="desc">
                活动名称
            </label>
            <div>
                <input type="text" name="activityname" value="{%$activityname|default:''%}" tabindex="1"
                       style="width:220px" class="field text small">

            </div>
        </li>
        <li>
            <label class="desc">
                适合年龄<font color="red">(*仅输入数字)</font>
            </label>
            <div>
                <input type="text" name="minage" value="{%$minage|default:''%}" tabindex="1" style="width:100px"
                       class="field text small">
                ~
                <input type="text" name="maxage" value="{%$maxage|default:''%}" tabindex="1" style="width: 100px"
                       class="field text small">

            </div>
        </li>
        <li>
            <label class="desc">
                活动时间
            </label>
            <div>
                <input type="text" name="starttime" value="{%$starttime|date_format:'%Y-%m-%d'|default:''%}" readonly
                       tabindex="1" style="width:100px" class="field text small datepicker">
                ~
                <input type="text" name="endtime" value="{%$endtime|date_format:'%Y-%m-%d'|default:''%}" readonly tabindex="1"
                       style="width: 100px" class="field text small datepicker">

            </div>
        </li>
        <li>
            <label class="desc">
                招募家庭<font color="red">(*仅输入数字)</font>
            </label>
            <div>
                <input type="text" name="maxnum" tabindex="1" value="{%$maxnum|default:''%}" style="width:220px"
                       class="field text small">

            </div>
        </li>
        <li>
            <label class="desc">
                积分兑换<font color="red">(*仅输入数字)</font>
            </label>
            <div>
                <input type="text" name="maxintegral" tabindex="1" value="{%$maxintegral|default:''%}"
                       style="width:220px" class="field text small">
            </div>
        </li>
        <li>
            <label class="desc">
                活动封面
            </label>
            <div>

                <label for="mediabtn" class="btn btn-success btn-sm"><i class="fa fa-file-image-o"></i>上传图片</label>
                <input onchange="showimg(this)" type="file" id="mediabtn" style="display: none" name="media" tabindex="1" class="field text small">
                <div> {%if $media|default:''%}<img src="/upload/{%$media|default:''%}" width="100">{%/if%}</div>
            </div>
        </li>
        <li >
            <label class="desc">
                内容
            </label>
            <div style="width: 50%">
                <div  id="content" name="content">
                    {%$content|default:''%}
                </div>
            </div>
        </li>


        <li class="buttons">
            <input id="btn_sub" type="button" value="保存" class="submit" onclick="dofrom()">
            <input type="hidden" name="act_id" value="{%$id|default:0%}"/>
            <input type="hidden" name="tk_name" value="{%$tk_name%}"/>
            <input type="hidden" name="tk_value" value="{%$tk_value%}"/>
            <input type="button" value="返回" class="submit" onclick="goback('/admin/activity')">
        </li>
    </ul>
</div>


{%/block%}
{%block name="js" append%}

<script type="text/javascript">
    var E = window.wangEditor
    var editor = new E('#content');
    editor.customConfig.zIndex = 100;
    // 隐藏“网络图片”tab
    editor.customConfig.showLinkImg = false;
    editor.customConfig.uploadFileName = 'filedata';
    // 配置服务器端地址
    editor.customConfig.uploadImgServer = '/api/uploadfile.json';
    // 限制一次最多上传 5 张图片
    editor.customConfig.uploadImgMaxLength = 1;
    $(function () {

        editor.create();
        $(".datepicker").datepicker({
            dateFormat: "yy-mm-dd",
            showOtherMonths: true,
            selectOtherMonths: true,
            showButtonPanel: true,
            showOn: "both",
            buttonImageOnly: true,
            buttonText: "",
            changeMonth: true,
            changeYear: true
        });


    })

    function dofrom() {
        var tk_name = $("input[name='tk_name']").val();
        var tk_value = $("input[name='tk_value']").val();
        var act_id = $("input[name='act_id']").val();
        var activityname = $("input[name='activityname']").val();
        var minage = $("input[name='minage']").val();
        var maxage = $("input[name='maxage']").val();
        var starttime = $("input[name='starttime']").val();
        var endtime = $("input[name='endtime']").val();
        var maxnum = $("input[name='maxnum']").val();
        var maxintegral = $("input[name='maxintegral']").val();
        var content=editor.txt.html();


        if (!isNull(activityname)) {
            showmsg('活动名称错误', 2);
            return false;
        }
        if (!isDigits(minage) || !isDigits(maxage)) {
            showmsg('适合年龄错误', 2);
            return false;
        }
        if (!isNull(starttime) || !isNull(endtime)) {
            showmsg('活动时间错误', 2);
            return false;
        }
        if (!isDigits(maxnum)) {
            showmsg('招募家庭错误', 2);
            return false;
        }
        if (!isDigits(maxintegral)) {
            showmsg('积分兑换错误', 2);
            return false;
        }

        var xhr = new XMLHttpRequest();
        var fdata = new FormData();
        fdata.append('tk_name', tk_name);
        fdata.append('tk_value', tk_value);
        fdata.append('act_id', act_id);
        fdata.append('activityname', activityname);
        fdata.append('minage', minage);
        fdata.append('maxage', maxage);
        fdata.append('starttime', starttime);
        fdata.append('endtime', endtime);
        fdata.append('maxnum', maxnum);
        fdata.append('maxintegral', maxintegral);
        fdata.append('media', $("input[name='media']")[0].files[0]);
        fdata.append('content', filterXSS(content));
        xhr.open('POST', "/api/createactivity.json", true);
        xhr.send(fdata);
        xhr.onreadystatechange = function () {
            if(xhr.readyState==4){
                if (xhr.status == 200) {
                    showmsg(xhr.responseText, 1);
                    dorefulsh();
                } else {
                    showmsg(xhr.responseText, 4);
                    dorefulsh();
                }

            }

        }

    }
    function  showimg(obj) {
        var files = obj.files[0];
        var imgtype=['jpg', 'png', 'jpeg','JPG','PNG','image/jpeg','image/png'];
        if (imgtype.indexOf(files.type) < 0) {
            showmsg('图片格式不正确', 2);
            return false;
        }else{
            var reader = new FileReader();
            reader.readAsDataURL(files);
            reader.onload = function(e) {
                obj.nextElementSibling.innerHTML='<img width="300" src="'+this.result+'" />';

            }
        }


    }

</script>
{%/block%}

